<template>
  <div>
    <!--<video src="./static/star.mov" class="earth-back" autoplay loop></video>-->
    <div class="earth-back"></div>
    <earth></earth>
    <block1></block1>
    <block2></block2>
    <block3></block3>
    <block4></block4>
    <block5></block5>
    <bar></bar>
  </div>
</template>

<script>
import Bar from 'components/Main/Bar'
import Earth from 'components/Main/Earth'
import Block1 from 'components/Main/Block1'
import Block2 from 'components/Main/Block2'
import Block3 from 'components/Main/Block3'
import Block4 from 'components/Main/Block4'
import Block5 from 'components/Main/Block5'

export default {
  name: 'main',
  components: {
    Earth,
    Block1,
    Block2,
    Block3,
    Block4,
    Block5,
    Bar
  }
}
</script>

<style scoped>
.earth-back{
  height: 100vh;
  background: url(../components/Main/img/earth-galaxy.jpg);
  background-size: 100% 100%;
}
</style>
